<template>
  <div>
    <a-button @click="demo">点击了</a-button>
    <h2>{{queryParams.pageNum}}</h2>
 
  </div>
</template>

<script setup lang="ts">
import { reactive, ref, toRefs, onMounted, watch,onBeforeMount } from "vue";
const data = reactive({
  form: {},
  queryParams: {
    pageNum: 1,
    pageSize: 10,
    postCode: undefined,
    postName: undefined,
    status: undefined
  },
  rules: {
    postName: [{ required: true, message: "岗位名称不能为空", trigger: "blur" }],
    postCode: [{ required: true, message: "岗位编码不能为空", trigger: "blur" }],
    postSort: [{ required: true, message: "岗位顺序不能为空", trigger: "blur" }],
  }
});
const {queryParams,rules}= toRefs(data)
function demo(){
  let a:number;
  a = 3
  queryParams.value.pageNum++
  console.log(queryParams.value.pageNum)
}
onMounted(() => {
  console.log(444)
})
onBeforeMount(() => {
  console.log(333)
})
const my = ref("5")
console.log(my.value)
// export default defineComponent({
//   setup() {
//     const data = reactive({
//       count: ref(0),
//       msg:{
//         name:"张三"
//       }
//     });

//     function demo() {
//       data.count++
//       console.log(data.count);
//       data.msg.name = "李四"
//       console.log(data.msg.name)
//     }
//     onMounted(() => {});
//     // watch(
//     //   "data.selectData.title":(newValue, oldValue) => {
//     //     console.log("值发生了变更", newValue, oldValue);
//     //   },
//     //   { deep: true }

//     // );
//     return {
//       demo,
//       ...data
//     };
//   },
// });
</script>

<style scoped></style>
